<template>
	<div class="sw_section_container">
		<div class="sw_query_form" v-if="$isHasAuth(topFrames)">
			<el-form size="small" inline>
				<template v-if="$isHasAuth(topButton)">
					<el-form-item>
						<el-date-picker v-model="timeRanges" v-bind="dateConfig"></el-date-picker>
					</el-form-item>
					<el-form-item>
						<el-select v-model="queryData.auditId1" placeholder="选择课题PI" class="query_select_wrapper">
							<el-option v-for="(item, index) in principalData" :key="index" :label="item.userName" :value="item.id"></el-option>
						</el-select>
					</el-form-item>
					<el-form-item>
						<el-button type="primary" icon="el-icon-search" @click="queryTableData">查询</el-button>
					</el-form-item>
					<el-form-item>
						<el-button icon="el-icon-refresh-left" @click="handleResetQuery">重置</el-button>
					</el-form-item>
				</template>
				<el-form-item v-hasPermi="'0a96663b7c14492d881f964fb3c588e0'">
					<el-button type="warning" icon="el-icon-upload2" @click="handleExportData">导出</el-button>
				</el-form-item>
			</el-form>
		</div>
		<div class="sw_table_container">
			<el-table size="medium" :data="tableData" stripe height="100%" class="index_table_wrapper" @selection-change="handleSelectionChange">
				<el-table-column type="selection" width="42"></el-table-column>
				<el-table-column prop="filed1" label="编号" min-width="120"></el-table-column>
				<el-table-column prop="name" label="课题名称" min-width="240"></el-table-column>
				<el-table-column prop="sector" label="研究领域" min-width="160"></el-table-column>
				<el-table-column label="测量技术" min-width="240" :formatter="returnMeasureList"></el-table-column>
				<el-table-column prop="auditName" label="课题PI" min-width="120"></el-table-column>
				<el-table-column prop="createName" label="申请人" min-width="120"></el-table-column>
			</el-table>
		</div>
		<sw-pagination :total="dataCount" :page.sync="queryData.page" :limit.sync="queryData.limit" @change="queryTableData"></sw-pagination>
	</div>
</template>

<script>
import mixins from '../mixins';
import { mapGetters } from 'vuex';
import { queryDownPageList } from '@/api/business/tbTopic';
export default {
	mixins: [mixins],
	data() {
		return {
			dataCount: 0,
			checkedData: []
		};
	},
	computed: {
		...mapGetters(['principalData']),
		topButton() {
			return ['36da4e885fcb40ef8a82232b53ea0838'];
		},
		topFrames() {
			return [...this.topButton, '0a96663b7c14492d881f964fb3c588e0'];
		}
	},
	watch: {
		timeRanges(data) {
			if (!data) {
				this.$delete(this.queryData, 'startTime');
				this.$delete(this.queryData, 'endTime');
			} else {
				this.$set(this.queryData, 'startTime', data[0]);
				this.$set(this.queryData, 'endTime', data[1]);
			}
		}
	},
	mounted() {
		this.handleResetQuery();
	},
	methods: {
		//获取课题列表数据
		async getTableData() {
			let params = { ...this.queryData };
			let result = await queryDownPageList(params).then((res) => res.data);
			if (result.code === '0') {
				this.dataCount = parseInt(result.count);
				this.tableData = result.data || [];
			}
		},

		//查询列表数据
		queryTableData() {
			this.loading = true;
			this.getTableData();
		},

		//重置查询
		handleResetQuery() {
			this.queryData = { page: 1, limit: 15 };
			this.timeRanges = null;
			this.$nextTick(() => {
				this.queryTableData();
			});
		},

		//返回测量技术
		returnMeasureList(data) {
			let measureList = data.measureList || [];
			return measureList.map((n) => n.piId).join();
		},

		//返回剩余机时
		returnSurplusHour(data) {
			let userHour = Number(data.userHour);
			let machineHour = Number(data.machineHour);
			return machineHour - userHour;
		},

		handleSelectionChange(selection) {
			this.checkedData = [...selection];
		},

		//导出数据
		handleExportData() {
			let params = {};
			if (this.checkedData.length !== 0) {
				params['ids'] = this.checkedData.map((n) => n.id).join();
			} else {
				params = { ...this.queryData };
				delete params.page;
				delete params.limit;
			}
			window.location.href = `${window.baseUrl}tbTopic/downTopic${this.$objectToQuery(params)}`;
		}
	}
};
</script>

<style scoped></style>
